/*-----------------------------------------------------------------------------
| Copyright (c) Jupyter Development Team.
| Distributed under the terms of the Modified BSD License.
|----------------------------------------------------------------------------*/
@import './variables.css';

/* Filter Box - Ant Design style */
.jp-FilterBox {
  background-color: #ffffff !important;
  border-radius: 2px;
  border: 1px solid #d9d9d9;
  padding: 4px 11px;
  width: 100%;
  display: flex;
  align-items: center;
  transition: all 0.3s;
}

.jp-FilterBox:hover {
  border-color: #40a9ff;
}

.jp-FilterBox:focus-within {
  border-color: #40a9ff;
  box-shadow: 0 0 0 2px rgba(24, 144, 255, 0.2);
}

.jp-FilterBox input {
  border: none;
  outline: none;
  width: 100%;
  font-size: 14px;
  line-height: 1.5715;
}

.jp-FilterBox input::placeholder {
  color: rgba(0, 0, 0, 0.25);
}

/* FILTER BOX */

#jp-main-dock-panel {
  padding: 0
}

#jp-title-panel-title {
  margin-left: 1rem
}

.jp-LabShell[data-shell-mode=single-document] #jp-menu-panel {
  padding-left: 0
}

#jp-bottom-panel {
  border-top: 1px solid var(--amphi-border-subtle)
}

#jp-bottom-panel {
  border-top: 1px solid var(--amphi-border-subtle)
}

/* Buttons - Ant Design style */
button.jp-mod-styled {
  border-radius: 2px;
  font-size: 14px;
  height: 32px;
  padding: 4px 15px;
  transition: all 0.3s;
}

button.jp-mod-styled.jp-mod-accept {
  background: #1890ff;
  border: 1px solid #1890ff;
  color: #ffffff;
}

button.jp-mod-styled.jp-mod-accept:hover {
  background: #40a9ff;
  border-color: #40a9ff;
}

button.jp-mod-styled.jp-mod-accept:active {
  background: #096dd9;
  border-color: #096dd9;
}

button.jp-mod-styled.jp-mod-reject {
  background: #ffffff;
  border: 1px solid #d9d9d9;
  color: rgba(0, 0, 0, 0.85);
}

button.jp-mod-styled.jp-mod-reject:hover {
  color: #40a9ff;
  border-color: #40a9ff;
}

button.jp-mod-styled.jp-mod-reject:active {
  color: #096dd9;
  border-color: #096dd9;
}

button.jp-mod-styled.jp-mod-warn {
  background: #ff4d4f;
  border: 1px solid #ff4d4f;
  color: #ffffff;
}

button.jp-mod-styled.jp-mod-warn:hover {
  background: #ff7875;
  border-color: #ff7875;
}

button.jp-mod-styled.jp-mod-warn:active {
  background: #d9363e;
  border-color: #d9363e;
}

:root {
  --bottom-statusbar-height: 28px;
  --footer-height: 113px;
  --bottom-panel-height: calc(var(--bottom-statusbar-height) + var(--footer-height));
  --header-panel-height: 48px
}

@media (min-width: 42rem) {
  :root {
    --footer-height: 43px
  }
}

#jp-header-panel {
  min-height: var(--header-panel-height) !important;
  height: var(--header-panel-height) !important
}

/* Menu Bar - Ant Design style */
.lm-MenuBar {
  background: #ffffff;
  border-bottom: 1px solid #f0f0f0;
  height: 40px;
  padding: 0 16px;
}

.lm-MenuBar-item {
  padding: 0 16px;
  color: rgba(0, 0, 0, 0.85);
  transition: color 0.3s;
  line-height: 40px;
}

.lm-MenuBar-item:hover {
  color: #1890ff;
}

.lm-Menu {
  background: #ffffff;
  box-shadow: 0 3px 6px -4px rgba(0, 0, 0, 0.12), 0 6px 16px 0 rgba(0, 0, 0, 0.08), 0 9px 28px 8px rgba(0, 0, 0, 0.05);
  border-radius: 2px;
  padding: 4px 0;
}

.lm-Menu-item {
  padding: 5px 12px;
  color: rgba(0, 0, 0, 0.85);
  transition: all 0.3s;
}

.lm-Menu-item:hover {
  background: #f5f5f5;
}

.lm-Menu-item.lm-mod-disabled {
  color: rgba(0, 0, 0, 0.25);
}

:root {
  --jp-private-menubar-height: 48px;
  --jp-private-menu-item-height: 34px
}

#jp-top-panel {
  background: var(--amphi-ui-01);
  border-bottom: 1px solid var(--amphi-skeleton-01)
}

.lm-Menu {
  background: var(--amphi-ui-01);
  box-shadow: none;
  border: none;
  padding: 0;
  box-shadow: var(--jp-elevation-z6)
}

.lm-MenuBar {
  background: var(--amphi-ui-01)
}

.lm-MenuBar-item {
  padding: 0 16px;
  background-color: transparent; /* Reset background after hover */
  transition: background-color 0.2s ease; /* Smooth transition for hover state */
  line-height: 46px;
}

.lm-MenuBar-item:hover {
  cursor: pointer;
  background-color: var(--amphi-hover-ui)
}

.lm-Menu-item:not(.lm-mod-disabled):not([data-type=separator]):hover {
  cursor: pointer;
  background-color: var(--amphi-hover-ui)
}

.lm-Menu-item[data-type=separator]>div {
  height: 0
}

.lm-Menu-item[data-type=separator]>div:after {
  border-top: 1px solid var(--amphi-ui-03);
  top: 0
}

.lm-Menu-item.lm-mod-disabled {
  color: var(--amphi-text-03)
}

/* Sidebar - Ant Design style */
.jp-SideBar.lm-TabBar {
  background: #ffffff;
  border-right: 1px solid #f0f0f0;
}

.jp-SideBar .lm-TabBar-tab {
  min-height: 40px;
  padding: 0 16px;
  color: rgba(0, 0, 0, 0.85);
  transition: all 0.3s;
}

.jp-SideBar .lm-TabBar-tab:hover {
  color: #1890ff;
}

.jp-SideBar .lm-TabBar-tab.lm-mod-current {
  background: #e6f7ff;
  color: #1890ff;
  border-right: 3px solid #1890ff;
}

.jp-SideBar .lm-TabBar-tab.lm-mod-current {
  background: var(--amphi-ui-02);
  box-shadow: inset 3px 0 0 var(--amphi-interactive-04);
}

.jp-SideBar .lm-TabBar-tab:hover {
  cursor: pointer
}

.jp-SideBar .lm-TabBar-tab:hover:not(.lm-mod-current) {
  background: var(--amphi-ui-02)
}

.jp-SideBar .lm-TabBar-tab:not(.lm-mod-current) {
  background: var(--amphi-ui-03);
  box-shadow: inset 3px 0 #0000
}

.jp-SideBar .lm-TabBar-tab .lm-TabBar-tabIcon {
  display: flex;
  align-items: center;
  /* Centers items vertically */
  justify-content: center;
  /* Centers items horizontally */
  width: 20px;
}

.jp-SideBar.lm-TabBar .lm-TabBar-tabLabel {
  display: none;
}

.p-SplitPanel-handle,
.lm-SplitPanel-handle {
  z-index: 0 !important
}

#kernelusage-panel-id {
  background-color: var(--amphi-ui-02);
  color: var(--amphi-text-02);
  overflow: auto !important
}

#kernelusage-panel-id hr.jp-KernelUsage-section-separator {
  border-top-color: var(--amphi-ui-03)
}

#kernelusage-panel-id h3.jp-KernelUsage-section-separator {
  font-size: 1.75rem;
  font-weight: 400;
  line-height: 1.28572;
  letter-spacing: 0
}

#kernelusage-panel-id h4.jp-KernelUsage-section-separator {
  font-size: 1.25rem;
  font-weight: 400;
  line-height: 1.4;
  letter-spacing: 0
}

/* TABAR */
:root {
  --jp-private-horizontal-tab-height: 32px
}

.lm-DockPanel-tabBar {
  z-index: 0 !important
}

.lm-DockPanel-tabBar .lm-TabBar-tab.lm-mod-current {
  background: var(--amphi-ui-01)
}

.lm-DockPanel-tabBar .lm-TabBar-tab {
  background: var(--amphi-ui-03);
  margin-left: 2px;
  line-height: calc(var(--jp-private-horizontal-tab-height) - var(--jp-private-horizontal-tab-active-top-border))
}

.lm-DockPanel-tabBar .lm-TabBar-tab:not(.lm-mod-current):hover {
  cursor: pointer;
  background: var(--amphi-hover-ui)
}

.lm-DockPanel-tabBar .lm-TabBar-tab:not(.lm-mod-current) {
  box-shadow: inset 0 var(--jp-private-horizontal-tab-active-top-border) var(--amphi-ui-03);
  border-left: 0;
  border-right: 0;
  border-bottom: 0
}

.lm-DockPanel-tabBar .lm-TabBar:not(.lm-mod-current) {
  box-shadow: inset 0 var(--jp-private-horizontal-tab-active-top-border) var(--amphi-ui-04);
  border-left: 0;
  border-right: 0;
  border-bottom: 0
}

.lm-DockPanel-tabBar .lm-TabBar-tab.lm-mod-current:before {
  top: 0
}

.lm-DockPanel-tabBar .lm-TabBar-addButton {
  cursor: pointer;
  padding-bottom: 4px
}

.lm-DockPanel-tabBar .lm-TabBar-addButton svg {
  height: 24px
}

.lm-DockPanel-handle {
  height: 0px;
  width: 0px;
}

.lm-DockPanel-handle[data-orientation='vertical'] {
  border-bottom: 1px solid var(--amphi-skeleton-01);
  background-color: #F1F4F7;
}

.lm-DockPanel-handle[data-orientation='horizontal'] {
  background-color: #F1F4F7;
}

.lm-CommandPalette-itemLabel {
  line-height: 1rem
}

.lm-CommandPalette-wrapper:after {
  background-color: #0000;
  right: 1rem
}

body {
  background-color: var(--amphi-ui-background, #ffffff)
}

body {
  scrollbar-color: var(--jp-scrollbar-color) var(--jp-scrollbar-bg);
  scrollbar-face-color: var(--jp-scrollbar-color);
  scrollbar-track-color: var(--jp-scrollbar-bg)
}

body ::-webkit-scrollbar {
  width: 14px;
  height: 14px
}

body ::-webkit-scrollbar-track {
  background: var(--jp-scrollbar-bg);
  border-radius: 0
}

body ::-webkit-scrollbar-thumb {
  background-color: var(--jp-scrollbar-color);
  border-radius: 8px;
  background-clip: padding-box;
  border: 3px solid rgba(0, 0, 0, 0)
}

/* Scrollbar - Ant Design style */
::-webkit-scrollbar {
  width: 6px;
  height: 6px;
}

::-webkit-scrollbar-thumb {
  background: rgba(0, 0, 0, 0.15);
  border-radius: 4px;
}

::-webkit-scrollbar-track {
  background: rgba(0, 0, 0, 0.06);
}

:root {
  --jp-private-sidebar-tab-width: 48px;
  --jp-private-sidebar-tab-height: 48px
}

.jp-SideBar.lm-TabBar {
  background: var(--amphi-ui-01);
  border-right: 1px solid var(--amphi-skeleton-01);
}

.jp-SideBar .lm-TabBar-tab {
  min-height: var(--jp-private-sidebar-tab-height);
  padding: 0 14px;
  align-items: center;
  /* Centers items vertically */
  display: flex;
  /* Add this to make the tab a flex container */
  justify-content: center;
  /* Centers items horizontally */
}

.jp-SideBar .lm-TabBar-tab.lm-mod-current {
  background: var(--amphi-ui-02);
  box-shadow: inset 3px 0 0 var(--amphi-interactive-04);
}

.jp-SideBar .lm-TabBar-tab:hover {
  cursor: pointer
}

.jp-SideBar .lm-TabBar-tab:hover:not(.lm-mod-current) {
  background: var(--amphi-ui-02)
}

.jp-SideBar .lm-TabBar-tab:not(.lm-mod-current) {
  background: var(--amphi-ui-03);
  box-shadow: inset 3px 0 #0000
}

.jp-SideBar .lm-TabBar-tab .lm-TabBar-tabIcon {
  display: flex;
  align-items: center;
  /* Centers items vertically */
  justify-content: center;
  /* Centers items horizontally */
  width: 20px;
}

.jp-SideBar.lm-TabBar .lm-TabBar-tabLabel {
  display: none;
}

#kernelusage-panel-id {
  background-color: var(--amphi-ui-02);
  color: var(--amphi-text-02);
  overflow: auto !important
}

#kernelusage-panel-id hr.jp-KernelUsage-section-separator {
  border-top-color: var(--amphi-ui-03)
}

#kernelusage-panel-id h3.jp-KernelUsage-section-separator {
  font-size: 1.75rem;
  font-weight: 400;
  line-height: 1.28572;
  letter-spacing: 0
}

#kernelusage-panel-id h4.jp-KernelUsage-section-separator {
  font-size: 1.25rem;
  font-weight: 400;
  line-height: 1.4;
  letter-spacing: 0
}

input.jp-mod-styled {
  background: var(--amphi-field-02);
  border-bottom: 1px solid var(--amphi-ui-04);
  font-size: var(--jp-ui-font-size1);
  height: 3rem;
  line-height: 1.25rem;
  outline: 2px solid rgba(0, 0, 0, 0);
  outline-offset: -2px;
  padding: 0 1rem;
  color: var(--amphi-text-01);
  max-height: 3rem;
  min-height: 3rem
}

.jp-select-wrapper {
  margin: .5rem 0
}

.jp-select-wrapper svg {
  top: 50%
}

.jp-select-wrapper select.jp-mod-styled {
  border: unset;
  border-bottom: 1px solid var(--amphi-ui-4);
  outline: 2px solid rgba(0, 0, 0, 0);
  outline-offset: -2px;
  padding: 0 25px 0 16px;
  min-height: 3rem
}

.jp-select-wrapper select.jp-mod-styled:hover {
  background-color: var(--amphi-hover-field);
  box-shadow: none
}

:root {
  --jp-private-toolbar-height: calc(48px + var(--jp-border-width))
}

.jp-Toolbar {
  background: var(--amphi-ui-01);
  padding-right: .625rem;
  border-bottom: 1px solid var(--amphi-border-subtle);
  min-height: 0px;
  /*var(--jp-toolbar-micro-height); */
  padding: 0px;
  padding-right: 5px;
  padding-left: 5px;
}

.jp-ToolbarButtonComponent-label {
  margin-left: 3px;

}

.jp-Toolbar .jp-Toolbar-item {
  display: flex;
  align-items: center;
  height: unset
}

.jp-Toolbar .jp-Notebook-ExecutionIndicator {
  display: flex;
  align-items: center
}

.jp-Toolbar .jp-Notebook-ExecutionIndicator svg {
  height: 16px
}

.jp-Toolbar .jp-Notebook-ExecutionIndicator-tooltip {
  border-radius: 0;
  transform: unset !important;
  top: var(--jp-private-toolbar-height);
  right: 10px
}

#jp-main-dock-panel[data-mode=single-document] .jp-MainAreaWidget>.jp-Toolbar {
  padding-left: .5rem
}

:root {
  --jp-private-input-height: 40px
}

.bp3-input-group {
  display: flex;
  align-items: center;
}

.bp3-input-group .bp3-input:first-child {
  padding-left: 3rem;
  padding-right: 1rem
}

.bp3-input-group .bp3-input-action:last-child {
  right: unset;
  margin-left: .5rem
}

.bp3-input {
  min-height: var(--jp-private-input-height)
}

.bp3-input::-moz-placeholder {
  color: var(--amphi-text-03) !important;
  opacity: 1
}

.bp3-input::placeholder {
  color: var(--amphi-text-03) !important;
  opacity: 1
}

.bp3-input-group .bp3-input-action,
.bp3-input-group>.bp3-input-left-container,
.bp3-input-group>.bp3-button,
.bp3-input-group>.bp3-icon {
  top: unset
}

.jp-InputArea-prompt {
  margin: 1rem 0 0
}

.jp-InputArea-editor {
  margin: 1rem 1rem 1rem 0
}

.jp-OutputArea-output {
  margin-bottom: 1rem
}

.jp-Cell {
  margin: 6px 0;
  padding: var(--jp-cell-padding) var(--jp-cell-padding) var(--jp-cell-padding) 0;
  background: var(--amphi-ui-01)
}

.jp-CodeCell.jp-mod-outputsScrolled .jp-Cell-outputArea {
  box-shadow: unset
}

.jp-MarkdownOutput {
  padding-top: 1rem;
  padding-bottom: 1rem
}

.jp-RenderedHTMLCommon p {
  font-size: var(--jp-ui-font-color1)
}

.jp-RenderedHTMLCommon .alert-info,
.jp-RenderedHTMLCommon .alert-warning,
.jp-RenderedHTMLCommon .alert-success,
.jp-RenderedHTMLCommon .alert-danger {
  color: #161616;
  border-radius: 0;
  border: 0
}

.jp-cell-toolbar {
  min-height: auto !important;
  padding: 1px;
  top: 16px;
  right: 16px
}

.jp-DocumentSearch-overlay {
  box-shadow: -2px 2px 4px -1px var(--jp-shadow-umbra-color), 0 4px 5px 0 var(--jp-shadow-penumbra-color)
}

.jp-DocumentSearch-overlay .jp-DocumentSearch-input-wrapper * {
  background-color: var(--amphi-field-02)
}

.jp-DocumentSearch-overlay .jp-DocumentSearch-input-wrapper {
  background-color: var(--amphi-field-02);
  outline: 2px solid rgba(0, 0, 0, 0)
}

.jp-DocumentSearch-overlay .jp-DocumentSearch-input-wrapper.jp-DocumentSearch-focused-input {
  outline-color: var(--amphi-focus)
}

.jp-DocumentSearch-overlay .jp-DocumentSearch-input-wrapper .jp-DocumentSearch-button-content {
  display: inline-flex
}

.jp-DocumentSearch-overlay .jp-DocumentSearch-input-wrapper .jp-DocumentSearch-index-counter {
  font-size: 12px
}

.jp-extensionmanager-entry.jp-extensionmanager-entry-should-be-uninstalled {
  display: none !important
}

.jp-extensionmanager-content header:first-of-type {
  display: none
}

.jp-FileBrowser {
  --jp-private-toolbar-height: calc(16px + var(--jp-border-width));
  padding: 1rem
}

.jp-FileBrowser .jp-FileBrowser-toolbar {
  background: var(--amphi-ui-02)
}

.jp-FileBrowser .jp-FileBrowser-toolbar.jp-Toolbar {
  margin: 0
}

.jp-FileBrowser .jp-DirListing-header {
  background-color: var(--amphi-ui-03);
  min-height: 2rem;
  align-items: center
}

.jp-FileBrowser .jp-DirListing-header .jp-DirListing-headerItem {
  /* display: flex; */
  align-items: center;
  /* height: 100% */
}

.jp-FileBrowser .jp-DirListing-header .jp-DirListing-headerItem.jp-id-name {
  font-weight: 600
}

.jp-FileBrowser .jp-DirListing-header .jp-DirListing-headerItem.jp-id-modified {
  flex: 0 0 8.5rem;
  font-weight: 600
}

.jp-FileBrowser .jp-DirListing-content .jp-DirListing-item {
  position: relative;
  /*color: var(--amphi-text-02);*/
  min-height: 2rem;
  align-items: center;
  padding: 0 12px;
  border-bottom: 1px solid var(--amphi-ui-03)
}

.jp-FileBrowser .jp-DirListing-content .jp-DirListing-item.jp-mod-running {
  box-shadow: inset 2px 0 var(--amphi-interactive-04)
}

.jp-FileBrowser .jp-DirListing-content .jp-DirListing-item.jp-mod-running .jp-DirListing-itemIcon:before {
  content: ""
}

.jp-FileBrowser .jp-BreadCrumbs.jp-FileBrowser-crumbs {
  margin: 16px 0;
  display: flex
}

.jp-FileBrowser .jp-BreadCrumbs.jp-FileBrowser-crumbs .jp-BreadCrumbs-home:nth-last-child(2) {
  color: var(--amphi-text-01)
}

.jp-FileBrowser .jp-BreadCrumbs.jp-FileBrowser-crumbs .jp-BreadCrumbs-home:not(:nth-last-child(2)) {
  color: var(--amphi-link-01)
}

.jp-FileBrowser .jp-BreadCrumbs.jp-FileBrowser-crumbs .jp-BreadCrumbs-home:not(:nth-last-child(2)):hover {
  cursor: pointer;
  text-decoration: underline
}

.jp-FileBrowser .jp-BreadCrumbs.jp-FileBrowser-crumbs .jp-BreadCrumbs-item {
  cursor: pointer
}

.jp-FileBrowser .jp-BreadCrumbs.jp-FileBrowser-crumbs .jp-BreadCrumbs-item:nth-last-child(2) {
  color: var(--amphi-text-01)
}

.jp-FileBrowser .jp-BreadCrumbs.jp-FileBrowser-crumbs .jp-BreadCrumbs-item:not(:nth-last-child(2)) {
  color: var(--amphi-link-01)
}

.jp-FileBrowser .jp-BreadCrumbs.jp-FileBrowser-crumbs .jp-BreadCrumbs-item:not(:nth-last-child(2)):hover {
  cursor: pointer;
  text-decoration: underline
}

.jp-FileBrowser .jp-DirListing-content .jp-DirListing-item .jp-DirListing-itemText {
  line-height: 20px
}

.jp-FileBrowser .jp-DirListing-content .jp-DirListing-item .jp-DirListing-itemModified {
  font-size: var(--jp-ui-font-size0);
  color: var(--amphi-text-02)
}

.jp-DirListing-item.lm-mod-drag-image,
.jp-DirListing-item.jp-mod-selected.lm-mod-drag-image {
  z-index: 2
}

.jp-About-externalLinks .jp-Button-flat {
  color: var(--amphi-link-01)
}

.jp-LogConsole-toolbarLogLevelDropdown svg {
  top: 14px
}

.lm-SplitPanel-handle {
  width: 2px !important;
  background-color: var(--jp-private-split-panel-color)
}

.lm-TabBar-tabCloseIcon:hover {
  cursor: pointer
}

:root {
  --jp-private-running-item-height: 48px
}

.jp-RunningSessions-shutdownAll.jp-mod-styled {
  color: var(--amphi-link-01);
  height: 48px;
  letter-spacing: 0
}

.jp-RunningSessions-shutdownAll.jp-mod-styled:hover {
  background-color: var(--amphi-hover-ui)
}

.jp-RunningSessions-section {
  min-height: var(--jp-private-running-item-height)
}

.jp-RunningSessions-header button.jp-Button.bp3-button.bp3-minimal {
  width: 3rem
}

.jp-RunningSessions-header button.jp-Button.bp3-button.bp3-minimal:hover {
  background-color: var(--amphi-hover-ui)
}

.jp-RunningSessions-sectionHeader {
  margin-bottom: 4px;
  height: 48px
}

.jp-RunningSessions-sectionHeader h2 {
  font-weight: 600;
  text-transform: none;
  letter-spacing: .16px;
  font-size: var(--jp-ui-font-size1);
  line-height: var(--amphi-productive-heading-01-line-height)
}

.jp-RunningSessions-item {
  padding: 0;
  margin: 0 16px;
  border-bottom: 1px solid var(--amphi-ui-03);
  align-items: center
}

.jp-RunningSessions-item:hover {
  cursor: pointer;
  background: var(--amphi-ui-03)
}

.jp-RunningSessions-shutdownAll.jp-mod-styled:focus {
  outline: 2px solid var(--jp-brand-color1);
  outline-offset: -2px
}

#jp-main-statusbar svg[data-icon="ui-components:terminal"],
#jp-main-statusbar svg[data-icon="ui-components:kernel"] {
  top: 1px
}

#jp-main-statusbar svg[data-icon="ui-components:trusted"] {
  top: 3px
}

#jp-main-statusbar svg[data-icon="ui-components:bell"] {
  height: 16px;
  top: 0
}

.jp-SpinnerContent {
  background: linear-gradient(to right, var(--amphi-brand-01) 10%, rgba(255, 255, 255, 0) 42%)
}

.jp-SpinnerContent:before {
  background: var(--amphi-brand-01)
}

.jp-switch[aria-checked=true] .jp-switch-track {
  background-color: var(--amphi-interactive-01)
}

.jp-switch:hover {
  background-color: unset
}

.jp-HTMLSelect.jp-DefaultStyle select {
  cursor: pointer
}

#jp-main-dock-container-panel {
  border-left: 2px solid var(--amphi-skeleton-01);
  border-right: 2px solid var(--amphi-skeleton-01)
}

#jp-main-statusbar {
  background: var(--amphi-ui-01)
}

:root {
  --shell-header-height: 48px;
  --shell-header-mobile-nav-width: 256px
}

.clear-search-decoration::-ms-clear,
.clear-search-decoration::-ms-reveal {
  display: none;
  height: 0rem;
  width: 0rem
}

.clear-search-decoration::-webkit-search-decoration,
.clear-search-decoration::-webkit-search-cancel-button,
.clear-search-decoration::-webkit-search-results-button,
.clear-search-decoration::-webkit-search-results-decoration {
  display: none
}

.scrollbar {
  --scrollbar-bg: transparent;
  --scrollbar-color: var(--amphi-skeleton-01);
  scrollbar-color: var(--scrollbar-color) var(--scrollbar-bg);
  scrollbar-face-color: var(--scrollbar-color);
  scrollbar-track-color: var(--scrollbar-bg)
}

.scrollbar-variant {
  --scrollbar-bg: transparent;
  --scrollbar-color: var(--amphi-text-03)
}

.scrollbar ::-webkit-scrollbar,
.scrollbar::-webkit-scrollbar {
  width: 14px;
  height: 14px
}

.scrollbar ::-webkit-scrollbar-track,
.scrollbar::-webkit-scrollbar-track {
  background: var(--scrollbar-bg);
  border-radius: 0
}

.scrollbar ::-webkit-scrollbar-thumb,
.scrollbar::-webkit-scrollbar-thumb {
  background-color: var(--scrollbar-color);
  border-radius: 8px;
  background-clip: padding-box;
  border: 3px solid transparent
}

.scrollbar ::-webkit-scrollbar-corner {
  background: var(--scrollbar-bg)
}

/* Root variables - Ant Design colors */
:root {
  --amphi-ui-01: #ffffff;
  --amphi-ui-02: #fafafa;
  --amphi-ui-03: #f0f0f0;
  --amphi-text-01: rgba(0, 0, 0, 0.85);
  --amphi-text-02: rgba(0, 0, 0, 0.65);
  --amphi-text-03: rgba(0, 0, 0, 0.45);
  --amphi-text-04: #ffffff;
  --amphi-interactive-01: #1890ff;
  --amphi-interactive-02: #ffffff;
  --amphi-interactive-04: #1890ff;
  --amphi-hover-primary: #40a9ff;
  --amphi-hover-secondary: #f5f5f5;
  --amphi-active-primary: #096dd9;
  --amphi-active-secondary: #e6f7ff;
  --amphi-danger: #ff4d4f;
  --amphi-hover-danger: #ff7875;
  --amphi-active-danger: #d9363e;
  --amphi-border-subtle: #f0f0f0;
  --amphi-skeleton-01: #f0f0f0;
  --amphi-hover-ui: #f5f5f5;
}
